<template>
  <div>
    <h2>清理缓存</h2>
    <p>清理状态完成，尝试重新登录</p>
    <el-button type="primary" @click="goToLogin">重新登录</el-button>
  </div>
</template>

<script setup>
import { onMounted } from 'vue';
import Cookies from 'js-cookie';
import { useRouter } from 'vue-router';

const router = useRouter();

// 清除所有cookie
function clearAllCookies() {
  const cookies = document.cookie.split(";");
  
  for (let i = 0; i < cookies.length; i++) {
    const cookie = cookies[i];
    const eqPos = cookie.indexOf("=");
    const name = eqPos > -1 ? cookie.substring(0, eqPos).trim() : cookie.trim();
    
    // 删除每个cookie
    Cookies.remove(name);
    
    // 同时尝试用不同的路径删除
    Cookies.remove(name, { path: '/' });
    Cookies.remove(name, { path: '', domain: '' });
  }
}

function goToLogin() {
  router.push('/login');
}

onMounted(() => {
  clearAllCookies();
});
</script>

<style scoped>
div {
  max-width: 500px;
  margin: 100px auto;
  text-align: center;
  padding: 20px;
  border: 1px solid #eee;
  border-radius: 4px;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
</style> 